<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>发起fetch请求</title>
  </head>
  <body>
    <label for="avatar">选择文件1</label>

    <input
      type="file"
      id="avatar"
      multiple
      name="avatar"
      accept="image/png, image/jpeg"
    />
    <button class="btn">点击发送获取PDF</button>
    <script>
      const btnDom = document.querySelector(".btn");
      const inputDom = document.querySelector("input");

      btnDom.onclick = () => {
        console.log("点击");
        getData();
      };
      const getData = async () => {
        const formData = new FormData();
        const inputData = document.querySelector("input");
        const filesData = inputData.files;
        for (let i = 0; i < filesData.length; i++) {
          formData.append("files", filesData[i]);
        }
        const newHeaders = new Headers({
          "Content-Type": "multipart/form-data; ",
          Host: "172.20.10.5:8089",
        });
        const res = await fetch("http://172.20.10.5:8089/api/files/merge", {
          //   headers: newHeaders,
          method: "POST",
          body: formData,
          //   redirect: "follow",
        });
        console.log(res, "1");
       debugger;
        const data = await res.blob();
        const contentDisposition = res.headers.get('Content-Disposition')
        console.log("contentDisposition",contentDisposition)
        const objectUrl = URL.createObjectURL(data);
        const anchor = document.createElement("a");
        anchor.href = objectUrl;
        anchor.target = "_blank";
        console.log(objectUrl);
        // anchor.click();
        // //请求之后逻辑
        // console.log(data) // jsonObj or text
      };
    </script>
  </body>
</html>
